<template>
	<view class="content">
		<view class="head">
			 <view class="head_left">
				 <image src="~@/static/logo.png" 
				 style="width: 230rpx;height:230rpx;
				 border-radius: 130rpx;margin: 9rpx;">
				 </image>
			 </view>
			 <view class="head_right">
				 <view class="head_right_l">
					 <view class="head_right_l_li">性别：</view>
					 <view class="head_right_l_li">生日：</view>
				 </view>			
				 <view class="head_right_i">		
					 <view class="head_right_i_li">{{Sex}}</view>
					 <view class="head_right_i_li">{{Birthday}}</view>
				 </view>	
			 </view>
		 </view>	
		
		<view class="central">
			<view class="central_li">				
				    <view class="central_li_left">RFID电子标签：</view>
					
					<view class="central_li_right">{{rfid}}</view>
			</view>
		</view>
		
		<view class="central">
			<view class="central_li">				
				    <view class="central_li_left">身体状况：</view>
			</view>
		</view>
		<view>
			<picker class="width-100" :range="SubsidizesList" :value="SubsidizesIndex" @change="canbie">
				<view class="xiala">
					{{SubsidizesList[SubsidizesIndex]}}&nbsp;▼
				</view>
			</picker>
		</view>
		<view class="central">
			<view class="central_li">				
				    <view class="central_li_left">体重：</view>
					
					<input type="text" v-model="weight" 
					style="width: 15%;text-align: center; font-size: 34rpx;
					border-bottom: #000000 solid 2rpx; "/>
			</view>
		</view>
		
		<view class="central">
			<view class="central_li">				
				    <view class="central_li_left">是否出售：</view>
					
					<view class="central_li_right">
						<radio-group >
							<label >
								<view>
									<radio value="是"  />
								</view>
								<view>是</view>
								</label>
									<label >
										<view>
											<radio value="否" />
										</view>
										<view>否</view>
									</label>
						</radio-group>
					</view>
			</view>
		</view>
		<br/>
		<view class="central">
			<view class="central_li">				
				    <view class="central_li_left" >修改人：</view>
					
					<input type="text" v-model="name" style="width: 20%;text-align: center; font-size: 34rpx;
					border-bottom: #000000 solid 2rpx;"/>
			</view>
		</view>
		
		<view class="bottom">
			<!-- <navigator url="../livestock_inf/pig_list" open-type="navigate" > -->
			<view class="bottom_button" @click="but">
				保存
			</view>
			<!-- </navigator> -->
		</view>
	</view>
	
</template>

<script>
	export default {
		data() {
			return {
				SubsidizesList: ['健康', '一般', '患病'],
				SubsidizesIndex: [0],
				Sex:"公",
				Birthday:"2020-10-10",
				rfid:"fgslghdfhlskdfjo",
				name:"王图水",
				weight:"400"
			}
		},
		methods: {
			but(){
				uni.navigateTo({
					url:"./pig_list"
				})
			},
			canbie(e) {
				this.SubsidizesIndex = e.target.value
					
			}
			
		}
	}
</script>

<style>
	ul{
		margin: 0;
		padding: 0;
	}
	view{
		margin: 0;
		padding: 0;
	}
	input{
		margin: 0;
		padding: 0;
	}
	.content{
		width: 100%;
		height: auto;
		margin-top: 25rpx;		
	}
	.head{
		display: flex;
		}
	.head_left{
		flex: 1;
		
		display: flex;
	}
	.head_right{
		flex: 2;
		display: flex;
	}	
	.head_right_l{	
		flex: 1;
	}
	.head_right_l_li{
		flex: 1;
		font-size: 34rpx;
		margin:30rpx 0 0 20rpx;
		
		text-align: center;
	} 
	
	.head_right_i{
		flex: 2;
	}
	.head_right_i_li{
		flex: 1;
		font-size: 34rpx;
		margin:30rpx 0 0 20rpx;	
	}
	
	.central{
		width: 100%;
		height: auto;
	}
	.central_li{
		width: 100%;
		height: auto;
		margin: 20rpx 50rpx;
	}
	.central_li_left{
		width: auto;
		font-size: 34rpx;
		float: left;
	}
	.central_li_right{
		width: auto;
		font-size: 34rpx;
	}
	.central_li_right>radio-group>label{
		float: left;
	}
	.central_li_right>radio-group>label>view{
		float: left;
	}
	.central_li_right>view{
		width: 100%;
		height: auto;
		
	}
	.central_li_right>view>picker{
		
	}
	.xiala {
		width:20%;
		border: #000000 1upx solid;
	    margin: 0 0 0 30%;
		font-size: 32upx;
		text-align: center;
		color:#000000 ;
		
	}
	
	.bottom{
		float: none;
		display: flex;
	}
	.bottom>navigator{
		width: 80%;
		height: 100rpx;
		margin: 100rpx 10% 0 10%;
		border-radius: 50rpx;
	}
	.bottom_button{
		width: 80%;
		height: 80rpx;
		font-size: 50rpx;
		margin: 100rpx 10% 0 10%;
		border: solid 1rpx #bfbfbf;
		text-align: center;
		color:#FFFFFF ;
		background-color: #4ac997;
		border-radius: 50rpx;
	}
	

</style>
